草庐IT

vue 组件的引用

全部标签

javascript - 在 vue.js 中重新加载或关闭之前做一些事情

我有一个带有beforeDestroy方法的Vue.JS应用程序,我试图用它在应用程序关闭或重新加载之前将一些数据存储在本地存储中。仅供引用:beforeDestroy:function(){localStorage.setItem('preference',this.preference);...}但是,关闭或重新加载应用程序实际上都不会调用此方法。如何确保在关闭应用程序之前调用此方法? 最佳答案 “关闭”或“重新加载”应用程序的是什么?是浏览器中的用户关闭窗口和/或刷新页面吗?如果是这样,则没有任何东西“被破坏”并且该函数将不会

javascript - 绑定(bind)在动态加载的组件中不起作用

我遇到了一个问题,如果我动态加载一个组件,模板中的所有绑定(bind)都不适合我。除此之外,永远不会触发ngOnInit方法。loadView(){this._dcl.loadAsRoot(Injected,null,this._injector).then(component=>{console.info('Componentloaded');})}动态加载组件import{Component,ElementRef,OnInit}from'angular2/core'declarevar$:any@Component({selector:'tester',template:`Dyna

javascript - Echarts.js 库 - 使用饼图的 onclick 事件引用页面

我正在使用echarts.js库来制作饼图,我想使饼图中的每个切片超链接到另一个页面。我现在使用静态数据点,以测试它是否有效-之后将更新为动态数据。下面是pie1a的示例-我希望T2、T2、T4和N/A引用他们自己的页面。T2="http://localhost/T2.html"。//ECHART_PIE1avarechartPie1a=echarts.init(document.getElementById('echart_pie1a'),theme);echartPie1a.setOption({tooltip:{trigger:'item',formatter:"{a}{b}:{

javascript - 我什么时候需要使用 super(props) 将 prop 传递给 React 组件的构造函数?

这个问题在这里已经有了答案:What'sthedifferencebetween"super()"and"super(props)"inReactwhenusinges6classes?(10个答案)关闭6年前。很多时候我们在构造函数中发送props但我们从来没有在构造函数中的任何地方使用this.props那么为什么需要传递它以及何时需要这样做。classAppextendsReact.Component{constructor(props){super(props);//Whendoweneedtosendpropstotheconstructorthis.state={data:

javascript - 为什么我的 React 组件渲染被调用两次,一次没有数据,然后又一次有数据,但是为时已晚的异常?

我有一个组件TreeNav,其数据来自api调用。我已经设置了reducer/action/promise和所有的管道,但是当我在数据上调用map()时在组件渲染中,得到“UncaughtTypeError:Cannotreadproperty'map'ofundefined”。故障排除显示TreeNavrender()被调用了两次。第二次是在数据从api返回之后。但是由于第一个render()错误,第二个render()永远不会运行。这是我的代码文件:--------reducers/index.js--------import{combineReducers}from'redux'

javascript - 带有 vuex 的 Vue js 使用 v-for 和 v-model 计算属性

我需要将v-for与v-model结合使用。我读了docs并且没有示例说明如何在不在变异处理程序之外执行变异的情况下将它与v-for一起使用。如何在不直接改变属性的情况下在v-for中使用v-model?0{{n}}//componentmethods:{...mapMutations({addToCart:ADD_TO_CART})}, 最佳答案 不确定我是否完全理解您的问题,但请查看以下内容:编辑已更新为使用Vuex-但不是通过v-model,因为那样不会调用所需的突变或操作conststore=newVuex.Store({s

javascript - 使用指令将组件动态添加到子元素

尝试使用指令将组件动态放置到子元素。组件(作为模板):@Component({selector:'ps-tooltip',template:`{{content}}`})exportclassTooltipComponent{@Input()content:string;}指令:import{TooltipComponent}from'./tooltip.component';@Directive({selector:'[ps-tooltip]',})exportclassTooltipDirectiveimplementsAfterViewInit{@Input('ps-toolti

javascript - Vue.js:根据方法对列表进行排序

我正在获取一些原始数据并显示项目列表。每个项目都有一个我用方法生成的复杂属性(不是计算属性)。该属性可能会根据用户输入而改变。是否可以根据该属性对列表项进行排序?HTML:{{calculateComplexProperty(item.time)}}JavaScript:calculateComplexProperty:function(time){//this.distanceisanexternalfactorthatisnotapropertyofthelistitem,//andthatcanbemanipulatedbytheuservarspeed=time*this.di

javascript - 将 Redux 状态传递给组件时的最佳实践

我正在与其他几个开发人员一起开发一个React+Redux项目,但我们无法就在何处传递状态和操作的最佳实践达成一致。我的方法是拥有一个“容器”或“提供者”组件,它是父组件,所有必需的状态和操作都映射到状态并向下传递到子组件,从而创建单一的真实来源。然而不利的一面是,您必须记住通过每个子组件向下传递操作和值,这可能很难遵循。另一种开发人员方法是在每个需要它的组件上,在堆栈中的任何位置使用mapStateToProps。因此,如果向下三层或四层的子组件需要特定状态,他将在该组件上使用mapStateToProps。他还会使用import关键字直接导入Action创建器,而不是将它们称为Pr

javascript - 在 React 组件中使用 setInterval

我正在阅读React官方网站上的教程。在生命周期方法的例子中,在componentDidMount方法下,给setInterval函数设置了一个timerID。我的问题是,即使timerID已初始化,但它从未在整个应用程序中被调用,应用程序如何在不在应用程序的任何地方显式调用timerID的情况下工作。这是下面的代码。classClockextendsReact.Component{constructor(props){super(props);this.state={date:newDate()};}componentDidMount(){this.timerID=setInterv